<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>18_RegExp-正则规则捕获组</title>
  <!-- 
  在 JavaScript 的正则表达式中，捕获组（Capture Groups）是一种强大的功能，可以用来提取和操作匹配的子字符串。捕获组通过使用圆括号  `()`  来定义。
  一、捕获组的定义
  捕获组是用圆括号包裹的正则表达式部分，它允许你在匹配过程中提取特定的子字符串。每个捕获组会在匹配成功时保存匹配的内容，并通过索引进行访问。

  二、基本用法
   1. 创建捕获组

  使用圆括号  `()`  来定义捕获组。例如：
  const regex = /(\d{3})-(\d{2})-(\d{4})/;
  const str = "123-45-6789";
  const match = str.match(regex);

  console.log(match); // 输出: [ '123-45-6789', '123', '45', '6789', index: 0, input: '123-45-6789', groups: undefined ]
  在这个例子中，整个匹配结果是  `123-45-6789` ，而三个捕获组分别捕获了  `123` 、 `45`  和  `6789` 。

   2. 访问捕获组

  捕获组的内容可以通过数组索引访问。 `match[0]`  是整个匹配结果， `match[1]`  是第一个捕获组， `match[2]`  是第二个捕获组，依此类推。
  console.log(match[1]); // 输出: '123'
  console.log(match[2]); // 输出: '45'
  console.log(match[3]); // 输出: '6789'
  三、命名捕获组

  从 ES2018 开始，JavaScript 支持命名捕获组。使用  `(?<name>...)`  的语法来定义命名捕获组。

   1. 创建命名捕获组
  const regex = /(?<area>\d{3})-(?<prefix>\d{2})-(?<line>\d{4})/;
  const str = "123-45-6789";
  const match = str.match(regex);

  console.log(match.groups); // 输出: { area: '123', prefix: '45', line: '6789' }
  在这个例子中， `area` 、 `prefix`  和  `line`  是命名捕获组的名称，可以通过  `match.groups`  访问。

   2. 访问命名捕获组

  可以通过命名来访问捕获组的内容：
  console.log(match.groups.area); // 输出: '123'
  console.log(match.groups.prefix); // 输出: '45'
  console.log(match.groups.line); // 输出: '6789'
  四、使用场景

  捕获组和命名捕获组在以下场景中非常有用：

  1. 数据提取：从字符串中提取特定格式的数据，例如日期、电话号码等。
  2. 替换操作：在字符串替换中使用捕获组，可以重用匹配的内容。
  3. 复杂匹配：在复杂的正则表达式中，使用捕获组可以使正则表达式更加模块化和可读。

  五、总结
  - 捕获组：通过圆括号  `()`  定义，可以提取匹配的子字符串。
  - 命名捕获组：使用  `(?<name>...)`  语法定义，提供了更易于理解和使用的方式来访问匹配的内容。
  - 访问方式：通过数组索引或命名访问捕获组的内容。
  -->
</head>
<body>

  <script>
    // 1.捕获组
    const message = "我最喜欢的两本书: 《黄金时代》和《沉默的大多数》、《一只特立独行的猪》"
    // ?: 表示非捕获组，不捕获匹配的内容，只用于分组
    const reg = /(?:《)(?<name>.+?)(?:》)/ig
    console.log(message.matchAll(reg));
    for (const item of message.matchAll(reg)) {
      console.log(item);
    }

    // 2. 将捕获组作为整体
    const str = "123-45-6789 abcskjdfklakladsadgvasabcabcsacabc";
    const regex = /(abc){2,}/ig
    console.log(str.match(regex));
    

  </script>
  
</body>
</html>